{% extends 'beastly/base.html' %}

{% block extrastyle %}
<link rel="stylesheet" type="text/css" media="screen" href="{{ media_url }}beastly/css/posts.css" />
{% endblock %}

{% block extrahead %}
<script type="application/x-javascript">
//<![CDATA[
function hide(id) {
	var element = document.getElementById(id);
	element.style.display="none";
}
function show(id) {
	var element = document.getElementById(id);
	element.style.display="";
}

window.onload = function(){ hide('editbox'); }
//]]>
</script>
{% endblock %}

{% block page_title %}
<h2>{{ topic.title }}</h2>
<p>{{ topic.post_count }} posts</p>
{% endblock %}

{% block content %}
<div id="posts">
	{% for post in post_list %}
	<div class="post">
		<div class="user_details">
			<p class="post_date"><a rel="bookmark" href="#post-{{ post.count }}"><abbr class="updated">{{ post.added|date:"M d, Y g:i a" }}</abbr></a></p>
			<img src="{{ media_url }}beastly/img/user.png" alt="user" />
			<a href="">{{ post.user.username }}</a>
			<p class="posts">{{ user.post_set.count }} posts</p>
		</div>
		<div class="description">
			{{ post.description_html }}
		</div>
	</div>
	{% endfor %}
</div>
{% if user.is_authenticated %}
<p class="new reply"><a href="#" onClick="show('editbox'); return false;">Add Reply</a></p>
{% endif %}
{% endblock %}

{% block editbox %}
{% if user.is_authenticated %}
<div id="editbox">
	<form id="add_post" method="post" action=".">
		<div class="instructions">
			<h4>Formatting Help</h4>
			<p>* for lists </p>
			<p>[Slashdot](http://slashdot.org)</p>
			<p>### Headers ###</p>
			<p><a href="http://daringfireball.net/projects/markdown/syntax">markdown</a></p>
			<p class="submit">
				<input type="submit" value="submit" /> <a href="#" onClick="hide('editbox'); return false;">cancel</a>
			</p>
		</div>
		{% if form.description.errors %}<p>fix this: {{ form.description.errors }}</p>{% endif %}
			
		{{ form.description }}
	</form>
</div>
{% endif %}
{% endblock %}
